// index.js
Page({
  data: {
    movielist: [], // 用于保存当前页面中显示的电影列表
    active: "1", // 用于描述当前导航选中项的类别 ID
    cityname: "未选择", // 用于绑定左上角位置信息
  },
  // 当点击顶部导航选项时
  tapNav(e) {
    let id = e.target.dataset.id; // 获取 data-id 参数
    // 别急着发请求，先去缓存中找找，看有没有存过
    wx.getStorage({
      key: id,
      success: (res) => {
        // 如果读到了，直接更新 UI
        // console.log("读取缓存数据", res);
        this.setData({
          movielist: res.data,
          active: id,
        });
      },
      fail: (err) => {
        // 如果没有读到数据，重新发送请求，且将数据缓存下来
        // console.log("读取缓存失败", err);
        // 发送 https 请求，访问当前类别下的电影列表
        this.loadData(id, 0).then((newlist) => {
          this.setData({
            movielist: newlist,
            active: id,
          });
          // 列表更新后，将该类别的电影列表存入 storage 缓存
          // 将 id 与 newlist 配对，存入缓存
          wx.setStorage({
            key: id,
            data: newlist,
          });
        });
      },
    });
    // this.setData({
    //     active: id
    // })
    // 发送 https 请求，访问当前类别下的电影列表
    // wx.request({
    //   url: 'https://api.tedu.cn/index.php',
    //   method: 'GET',
    //   data: {cid: id, offset: 0},
    //   success: (res) =>{
    //       console.log(res);
    //       this.setData({
    //         movielist: res.data,
    //         active: id
    //       })
    //   }
    // })
  },
  /**
   * 通过 类别ID 与 起始下标位置 查询相应类别下的电影列表
   * @param {number} cid 类别ID
   * @param {number} offset 起始下标位置
   * @return {param} 返回电影列表
   */
  loadData(cid, offset) {
    return new Promise((resolve, reject) => {
      wx.showLoading({
        title: "猪八戒正在赶来...",
        mask: true,
      });

      wx.request({
        url: "https://api.tedu.cn/index.php",
        method: "GET",
        data: { cid, offset },
        success: (res) => {
          resolve(res.data); // 将 res 中的电影列表返回给 promise 的持有者
        },
        fail: (err) => {
          reject(err); // 将错误消息返回给 promise 的持有者
        },
        complete: (msg) => {
          // 无论成功或失败都执行
          // 隐藏等待框
          wx.hideLoading();
        },
      });
    });
  },
  //   加载当前定位信息
  getLocation() {
    let QQMapWX = require("../../libs/qqmap-wx-jssdk");
    let qqmapsdk = new QQMapWX({
      key: "P73BZ-PYXLV-34WPE-UCFWX-ECGVH-POFLG",
    });
    // 逆地址解析
    qqmapsdk.reverseGeocoder({
      success: (res) => {
        // console.log("当前位置信息", res);
        let city = res.result.address_component.city;
        // console.log(city);
        this.setData({
          cityname: city,
        });
        // 将 cityname 存入 globalData
        getApp().globalData.cityname = city;
      },
    });
  },
  /**
   * 首页加载时执行
   */
  onLoad() {
    //   加载当前位置信息
    this.getLocation();
    //    wx.request({
    //      url: 'https://api.tedu.cn/index.php',
    //      method: 'GET',
    //      data: {cid: 1, offset: 0},
    //      success: (res) =>{
    //          console.log(res);
    //         //  将 res.data 存入 this.data.movielist
    //         this.setData({
    //             movielist: res.data
    //         })
    //      }
    //    })
    this.loadData(1, 0).then((newlist) => {
      //   console.log("加载首页电影列表", newlist);
      this.setData({
        movielist: newlist,
      });
    });
  },
  // 当前页滚动到底后触发
  onReachBottom() {
    console.log("到底哦了");
    // 发送 HTTPS 请求，访问当前类别的下一页电影列表
    let cid = this.data.active;
    let offset = this.data.movielist.length;
    // wx.request({
    //   url: 'https://api.tedu.cn/index.php',
    //   method: 'GET',
    //   data: { cid, offset },
    //   success: (res) =>{
    //       console.log("加载下一页", res);
    //     //   将数组追加到 movielist 末尾
    //       this.setData({
    //           movielist: this.data.movielist.concat(res.data)
    //       })
    //   }
    // })
    this.loadData(cid, offset).then((newlist) => {
      // 将 newlist 追加到 data.movielist 的末尾
      this.setData({
        movielist: this.data.movielist.concat(newlist),
      });
    });
  },

  //   监听下拉刷新
  onPullDownRefresh() {
    // console.log("this.onPullDownRefresh");
    // 发送 https 请求  访问当前类别下的第一页电影数据
    let cid = this.data.active;
    let offset = 0;
    this.loadData(cid, offset).then((newlist) => {
      this.setData({
        movielist: newlist,
      });
      //   手动停止下拉刷新动画
      wx.stopPullDownRefresh();
      //   一旦拿到响应，要更新huancun(把最新列表数据存一遍)
      wx.setStorage({
        key: cid,
        data: newlist,
      });
    });
  },
  onShow() {
    let cityname = getApp().globalData.cityname;
    this.setData({
      cityname,
    });
  },
});
